<script setup lang="ts">
defineProps<{ message?: string }>()
</script>

<template>
  <div class="card bg-base-100 border-base-300 border shadow-sm">
    <div class="card-body flex-center text-base-content/70 py-12 text-lg">
      <slot name="icon">
        <img src="/favicon.png" alt="logo" class="size-24" />
      </slot>
      <p class="text-base-content/50 text-2xl font-semibold">
        {{ message ?? 'No data available' }}
      </p>
    </div>
  </div>
</template>
